<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ include file="/WEB-INF/jsp/common/common.jsp"%>
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>展示岗位和角色</title>
 	<link href="${prcs}/css/def/frm/common/common.css" rel="stylesheet">
	<link href="${pageContext.request.contextPath}/resource/css/def/ztree/metro.css" rel="stylesheet">
	<script type="text/javascript" src="${pageContext.request.contextPath}/resource/js/jquery/plugin/jquery.ztree.all-3.5.min.js"></script>

	</head>
<body>
<!--组织树开始  -->
	<div style="text-align: center;font-weight:bold;font-size:20px;">下拉框选择树demo页</div>
	<div>
	    <div style="font-weight:bold;font-size:16px;">组织树:根据传入的根节点的orgCode，在下拉框中使用ztree展示相应的组织上下级关系</div>
		<div style="font-weight:bold;font-size:12px;">
		<label>场景一：根节点是山东分公司，下级节点济南分公司、青岛分公司等，再下级节点是部门，再下级是处室</label><br>
		<label>场景二：根节点是济南分公司，下级节点是部门，再下级是处室</label><br>
		<label>场景三：根节点是山东分公司，下级节点济南分公司、青岛分公司等（参数has_bm==0不展示部门）</label>
		</div>
		<div>1.导入所需文件</div>
		<div>
			<pre>&lt;script type="text/javascript" src="treeDropDown.js"&gt;&lt;/script&gt;</pre>
		</div>
		<div>2.调用方法<code>selectOrgTree(orgCode,callBackFunction,has_bm,orgKind,ifRadio,serial)</code>,会向页面中添加如下div</div>
		<div>
			<pre>&lt;div id='orgDIV"+serial+"' class='wodetreeclass' style='position: absolute;background-color: white;border:1px solid #3aa5ff;z-index: 1052;'&gt;&lt;/div&gt;
</pre>
			<br>参数:  
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgCode:组织编码,此组织作为根节点
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;callBackFunc：回调函数
    	    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;has_bm:‘1’显示（默认值），‘0’不显示，控制是否显示部门及其以下组织，如果不显示部门，则只需要展示到分公司级（比如济南第一分公司）
      		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgKind:组织类型'1'甲方'2'乙方
   	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ifRadio:‘1’单选‘2’多选
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;serial:树的序号
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;width:控制下拉框的最大宽度
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height:控制下拉框的最大高度
			<br>参数的传递顺序不可改变
		</div>
		<div>3.post数据返回后会再向id=orgDIV+serial的div中添加 ztree
		<pre>&lt;ul id='orgTrees"+serial+"' class='ztree'&gt;&lt;/ul&gt;</pre>
		</div>
		<div>4.单选情况下,在进行树的节点点击操作后,返回给回调函数callBackFunc三个参数orgId,orgName,orgCode.</div>
		<div>5.多选情况下,在选中多个节点进行点击确定操作后，返回给回调函数callBackFunc三个参数orgId,orgName,orgCode,每一个参数的多个返回值使用逗号拼接。</div>
	</div>
	<div>
	<label>展示示例</label>
	<div class=" col-sm-12">
			<label class="col-sm-4" for="orgName">组织树下拉框<br>(orgCode='0037',callBackFunc=yourFunction1,
			<br>has_bm='1',orgKind='1',ifRadio='2'serial=1)</label>
			<div class="col-sm-6">
				<input type="text" name="orgName" id="orgName1" onclick="selectOrgTree('0037',yourFunction1,'1','1','2',1);" placeholder="请点击这里查看组织树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId1" value="" readonly="readonly"> 
				<input type="text" name="author" id="orgCode1" value="" readonly="readonly">
			</div>
	</div>
	<div class="col-sm-12">
			<label class="col-sm-4" for="orgName">组织树下拉框<br>(orgCode='0037',callBackFunc=yourFunction2,
			<br>has_bm='1',orgKind='1',ifRadio='2',
			<br>serial=2,width=200,height=300)</label>
			<div class="col-sm-6">
				<input type="text" name="orgName" id="orgName2" onclick="selectOrgTree('0037',yourFunction2,'1','1','2',2,200,300);" placeholder="请点击这里查看组织树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId2" value="" readonly="readonly"> 
				<input type="text" name="author" id="orgCode2" value="" readonly="readonly">
			</div>
	</div>
		<div class="col-sm-12">
			<label class="col-sm-4" for="orgName">组织树下拉框<br>(orgCode='0037',callBackFunc=yourFunction7,
			<br>has_bm='1',orgKind='1',ifRadio='1',
			<br>serial=3,width=200,height=300)</label>
			<div class="col-sm-6">
				<input type="text" name="orgName" id="orgName3" onclick="selectOrgTree('0037',yourFunction7,'1','1','1',3,200,300);" placeholder="请点击这里查看组织树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId3" value="" readonly="readonly"> 
				<input type="text" name="author" id="orgCode3" value="" readonly="readonly">
			</div>
	</div>
	</div>
<div>******************************************************************************</div>
<!--组织树结束  -->
<!--******************************************************************************-->
<!-- 建设单位树开始 -->
	<div>
	    <div style="font-weight:bold;font-size:16px;">建设单位树:根据传入的根节点的disId，在弹出的模态框中使用ztree展示相应的建设单位上下级关系</div>
		<div style="font-weight:bold;font-size:12px;">
		<label>场景一：根节点是山东,下级节点本部、济南、青岛等,再下级节点是区县</label><br>
		<label>场景二：根节点是济南,下级节点是区县</label><br>
		<label>场景三：根节点是山东,下级节点本部、济南、青岛等(参数has_qx==0不展示区县)</label>
		</div>
		<div>1.导入所需文件</div>
		<div>
			<pre>&lt;script type="text/javascript" src="treeDropDownn.js"&gt;&lt;/script&gt;</pre>
		</div>
		<div>2.调用方法<code>selectDisTree(disId,callBackFunc,has_qx,only_qx,ifRadio,serial,width,height)</code>,会向页面中添加如下div</div>
		<div>
			<pre>&lt;div id='disDIV"+serial+"' class='wodetreeclass' style='position: absolute;background-color: white;border:1px solid #3aa5ff;z-index: 1052;'&gt;&lt;/div&gt;
</pre>
			<br>参数:  
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;disId:建设单位ID,根节点可以传山东或者地市,如果传地市,则地市就是根节点,下级节点就直接是所属区县
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;callBackFunc:回调函数
    	    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;has_qx:'1'显示（默认值）,'2'不显示,控制是否显示区县,如果不显示区县,则只需要展示到地市级
      		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;only_qx:'1'只可以选择区县,不可以选择其他节点组织'2'可以选择任何节点的组织
   	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ifRadio:'1'单选'2'多选
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;serial:树的序号
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;width:控制下拉框的最大宽度
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height:控制下拉框的最大高度
			<br>参数的传递顺序不可改变
		</div>
		<div>3.post数据返回后会再向id=disDIV+serial的div中添加 ztree
		<pre>&lt;ul id='disTrees"+serial+"' class='ztree'&gt;&lt;/ul&gt;</pre>
		</div>
		<div>4.单选情况下,在进行树的节点点击操作后,返回给回调函数callBackFunc两个参数 disId,disName.</div>
		<div>5.多选情况下,在选中多个节点进行点击确定操作后，返回给回调函数callBackFunc两个参数 disId,disName,每一个参数的多个返回值使用逗号拼接。</div>
	</div>

	<div>
		<label>展示示例</label>
		<div class="col-sm-12">
			<label class="col-sm-4" for="orgName">建设单位树下拉框<br>(disId='3701',callBackFunc=yourFunction3,
			<br>has_qx='1',only_qx='1',ifRadio='2',serial=1)</label>
			<div class="col-sm-6">
				<input type="text" name="disName" id="disName1" onclick=" selectDisTree('3701', yourFunction3,'1','1','2',1);" placeholder="请点击这里查看建设单位树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="disId1" value="" readonly="readonly"> 
			</div>
	</div>
	<div class=" col-sm-12">
			<label class="col-sm-4" for="orgName">建设单位树下拉框<br>(disId='3701',callBackFunc=yourFunction4,
			<br>has_qx='1',only_qx='1',ifRadio='2',
			<br>serial=2,width=120,height=200)</label>
			<div class="col-sm-6">
				<input type="text" name="disName" id="disName2" onclick=" selectDisTree('3701',yourFunction4,'1','1','2',2,120,200);" placeholder="请点击这里查看建设单位树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="disId2" value="" readonly="readonly"> 
			</div>
	</div>
		<div class=" col-sm-12">
			<label class="col-sm-4" for="orgName">建设单位树下拉框<br>(disId='3701',callBackFunc=yourFunction8,
			<br>has_qx='1',only_qx='1',ifRadio='1',
			<br>serial=3,width=120,height=200)</label>
			<div class="col-sm-6">
				<input type="text" name="disName" id="disName3" onclick=" selectDisTree('3701',yourFunction8,'1','1','1',3,120,200);" placeholder="请点击这里查看建设单位树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="disId3" value="" readonly="readonly"> 
			</div>
	</div>
	</div>

<!-- 建设单位树结束-->
<!-- 人员树开始 -->
	<div>
	    <div style="font-weight:bold;font-size:16px;">人员选择树:根据传入的根节点的orgCode，在下拉框中使用ztree展示相应的组织中，各部门、各岗位下的员工</div>
		<div style="font-weight:bold;font-size:12px;">
		<label>场景一：根节点是山东分公司，下级节点济南分公司、青岛分公司等，再下级节点是部门，再下级是处室</label><br>
		<label>场景二：根节点是济南分公司，下级节点是部门，再下级是处室</label><br>		
		</div>
		<div>1.导入所需文件</div>
		<div>
			<pre>&lt;script type="text/javascript" src="treeDropDown.js"&gt;&lt;/script&gt;</pre>
		</div>
		<div>2.调用方法<code>selectStaffTree(orgCode,callBackFunc,orgKind,staffKind,ifRadio,serial,width,height)</code>,会向页面中添加如下div</div>
		<div>
		<pre>&lt;div id='staffDIV"+serial+"' class='wodetreeclass' style='position: absolute;background-color: white;border:1px solid #3aa5ff;z-index: 1052;'&gt;&lt;/div&gt;
		</pre>
			<br>参数:  
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgCode:组织编码,此组织作为根节点
			<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;callBackFunc:回调函数
      		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgKind:组织类型'1'甲方'2'乙方
      		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;staffKind:人员类型'1'甲方'2'乙方      		
   	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ifRadio:'1'单选'2'多选
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;serial:树的序号
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;width:控制下拉框的最大宽度
	 		<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height:控制下拉框的最大高度
			<br>参数的传递顺序不可改变
		</div>
		<div>3.post数据返回后会再向id=staffDIV+serial的div中添加 ztree
		<pre>&lt;ul id='staffTrees"+serial+"' class='ztree'&gt;&lt;/ul&gt;</pre>
		</div>
		<div>4.单选情况下,在进行树的节点点击操作后,返回给回调函数callBackFunc五个参数orgId,orgName,staffId,staffOrgId,staffName.</div>
		<div>5.多选情况下,在选中多个节点进行点击确定操作后，返回给回调函数callBackFunc五个参数orgId,orgName,staffId,staffOrgId,staffName,每一个参数的多个返回值使用逗号拼接。</div>
	</div>	
	<div>
		<label>展示示例</label>
			<div class=" col-sm-12">
			<label class="col-sm-4" for="orgName">人员树下拉框<br>((orgCode='29854',callBackFunc=yourFunction5,orgKind='1',
			<br>staffKind='1',ifRadio='2'serial=5)</label>
			<div class="col-sm-6">
				<input type="text" name="staffName" id="staffName5" onclick="selectStaffTree('29854',yourFunction5,'1','1','2',5);" placeholder="请点击这里查看人员树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId5" value="" readonly="readonly">  
				<input type="text" name="author" id="orgName5" value="" readonly="readonly">
				<input type="text" name="author" id="staffOrgId5" value="" readonly="readonly"> 
				<input type="text" name="author" id="staffId5" value="" readonly="readonly">
			</div>
	</div>
	<div class="col-sm-12">
			<label class="col-sm-4" for="orgName">人员树下拉框<br>((orgCode='29854',callBackFunc=yourFunction6,
			<br>orgKind='1',staffKind='1',ifRadio='2',
			<br>,serial=6,width=200,height=300)</label>
			<div class="col-sm-6">
				<input type="text" name="staffName" id="staffName6" onclick="selectStaffTree('29854',yourFunction6,'1','1','2',6,200,300);" placeholder="请点击这里查看人员树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId6" value="" readonly="readonly"> 
				<input type="text" name="author" id="orgName6" value="" readonly="readonly">
				<input type="text" name="author" id="staffOrgId6" value="" readonly="readonly">
				<input type="text" name="author" id="staffId6" value="" readonly="readonly">
			</div>
	</div>
		<div class="col-sm-12">
			<label class="col-sm-4" for="orgName">人员树下拉框<br>((orgCode='29854',callBackFunc=yourFunction9,
			<br>orgKind='1',staffKind='1',ifRadio='1',
			<br>,serial=7,width=200,height=300)</label>
			<div class="col-sm-6">
				<input type="text" name="staffName" id="staffName7" onclick="selectStaffTree('29854',yourFunction9,'1','1','1',7,200,300);" placeholder="请点击这里查看人员树" class="col-xs-10 col-sm-5 form-control" readonly="readonly">
				<input type="text" name="author" id="orgId7" value="" readonly="readonly"> 
				<input type="text" name="author" id="orgName7" value="" readonly="readonly">
				<input type="text" name="author" id="staffOrgId7" value="" readonly="readonly">
				<input type="text" name="author" id="staffId7" value="" readonly="readonly">
			</div>
	</div>
	</div>

<!-- 人员树结束-->	
	</div>
</body>
	<script type="text/javascript" src="${pageContext.request.contextPath }/resource/js/frm/sys/treeDropDown.js"></script>
</html>